$(document).ready(function () {
    //顶目录移动事件
    let menu2 = $('.container .head1 .menu ul li:nth-child(2)')
    let list_menu = $('.container .head1 .menu .list_menu')
    menu2.hover(function () {
        list_menu.addClass('active')
    }, function () {
        list_menu.removeClass('active')
    })
    list_menu.mousemove(function () {
        list_menu.addClass('active')
    })

    //左目录栏箭头点击事件
    let arrow = $('.container .content .inner .left .c_content span')
    let c_content = $('.container .content .inner .left .c_content')
    arrow.click(function () {
        let div_index = $(this)
        let nth = div_index.parent().parent().index()
        let category_nth = c_content.find(`.category:nth-child(${nth+1})`)
        let category_content = category_nth.find('.category_content')

        if (category_content.hasClass('active')){
            category_content.removeClass('active')
            category_nth.find('.category_head span').text('▼')
        }else {
            category_content.addClass('active')
            category_nth.find('.category_head span').text('◀')
        }
    })

    //鼠标移动到下面的小图上

    let $images_img = $('.spec-list .images > img')
    $images_img.mouseover(function () {
        $images_img.removeClass('active')
        let $this = $(this);
        let lix = $this.closest('li')
        let img_box_img = lix.find('.img_box a img')
        $this.addClass('active')
        img_box_img.attr('src', $this.attr('src'))
    });

    // 点击两侧的箭头
    let arrow_l = $('.spec-list a.arrow_l')
    let arrow_r = $('.spec-list a.arrow_r')
    let btn_locked = false;

    arrow_l.click(function () {
        let $this = $(this)
        let images1 = $this.next()
        let images_hidden_str = images1.attr('style')   //获取style属性
        let images_hidden_count = 0
        if (images_hidden_str) {
            let length = parseInt(images_hidden_str.substring(14,16))  //获取text-indent的值
            if (length <= 40 && length >= 1)
            {
                length = parseInt(images_hidden_str.substring(14,17))
            }
            images_hidden_count = length / 42
            if (!length) {
                images_hidden_count = 0
            }
            btn_locked = false;
        }else {
            btn_locked = false;
        }
        let lix = $(this).closest('li')
        let images = lix.find('.images')
        if (images_hidden_count > 0) {
            if (btn_locked) {
                return false;
            }
            images_hidden_count -= 1
            let text_indent = -(42 * images_hidden_count) + 'px'
            images.animate({'text-indent': text_indent}, 300)
        }
    });

    arrow_r.click(function () {
        let $this = $(this)
        let images1 = $this.prev()
        let images_hidden_str = images1.attr('style')  //获取style属性
        let images_hidden_count = 0
        if (images_hidden_str) {
            let length = parseInt(images_hidden_str.substring(14,16))  //获取text-indent的值
            if (length <= 40)
            {
                length = parseInt(images_hidden_str.substring(14,17))
            }
            images_hidden_count = length / 42
            if (!length) {
                images_hidden_count = 0
            }
            btn_locked = false;
        } else {
            btn_locked = false;
        }
        let lix = $(this).closest('li')
        let images = lix.find('.images')
        let images_img_count = images.find('> img').length
        if (images_hidden_count < images_img_count - 4) {
            if (btn_locked) {
                return false;
            }
            images_hidden_count += 1
            let text_indent = -(42 * images_hidden_count) + 'px'
            images.animate({'text-indent': text_indent}, 300)
        }
    });
});